<template>
	<div class="services">
		<div class="pTitles">参数设置</div>
		<el-form :inline="true" :model="formInline" class="demo-form-inline">
			<el-form-item label="考勤时间:">
				<el-time-picker
				    is-range
				    arrow-control
				    v-model="formInline.time"
				    range-separator="-"
				    start-placeholder="开始时间"
				    end-placeholder="结束时间"
				    placeholder="选择时间范围"
					style="width: 180px;"
					>
				  </el-time-picker>
			</el-form-item>
			<el-form-item label="电子围栏距离:">
				<el-input v-model="formInline.user1" style="width: 110px;">
					 <template slot="suffix">米</template>
				</el-input>
			</el-form-item>
			<el-form-item label="穿越最短间隔:">
				<el-input v-model="formInline.user2" style="width: 110px;">
					 <template slot="suffix">分钟</template>
				</el-input>
			</el-form-item>
			<el-form-item label="日出勤小时数:">
				<el-input v-model="formInline.user3" style="width: 110px;">
					 <template slot="suffix">小时</template>
				</el-input>
			</el-form-item>
		</el-form>
		<!-- <div class="pTitles">
			选择查看任务
			<el-select v-model="servicesTeam" style="width: 160px;float: right;margin-top: -6px;" placeholder="请选择任务">
				<el-option label="1" value="1"></el-option>
				<el-option label="2" value="2"></el-option>
			</el-select>
		</div> -->
		<el-table :data="tableData" style="width: 100%;margin-top: 10px;" border :header-cell-style="rowClass">
			<el-table-column label="围栏面积" prop="name"></el-table-column>
			<el-table-column label="栽培品种" prop="name1"></el-table-column>
			<el-table-column label="面积" prop="num"></el-table-column>
			<el-table-column label="栽培年份" prop="rz"></el-table-column>
		</el-table>
		<div class="mapsBox" id="container">
			<baidu-map class="bm-view mapBoxmapBox" style="height: 100%;" :center="maps.center" :zoom="maps.zoom" :scroll-wheel-zoom="true">
				 <bm-marker :position="maps.center" :dragging="true" />
			 </baidu-map>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				servicesTeam: '',
				tableData: [{
					name: '10月 08日周四',
					name1: '10月 16日周五',
					num: 'XXXX公司XXX基地',
					rz: '重庆市云阳县养鹿镇养鹿社区2组',
					td: '张涛',
					address: '183****1234',
					shop: '施肥管理 春肥',
					shopId: '需要背负喷雾器喷洒农药',
					zt: '未开始'
				}],
				formInline: {},
				maps:{
					// center:returnCitySN.cname,
					center: {lng: 106.53063501, lat: 29.54460611},
					zoom: 15
				},
			}
		},
		methods: {
			rowClass({
				row,
				column,
				rowIndex,
				columnIndex
			}) {
				// if(columnIndex == 2){
				return 'background: #FAFAFA'
				// }
				// console.log(columnIndex) //表头行下标

			},
		}
	}
</script>

<style scoped="scoped">
	.pTitles {
		color: #303133;
		font-size: 14px;
		padding: 14px 0;
		margin-top: 15px;
	}

	.mapsBox {
		width: 100%;
		height: 500px;
		margin-top: 30px;
		/* background: #1C85C1; */
		text-align: center;
		line-height: 500px;
		font-size: 30px;
		color: #AAAAAA;
	}
</style>
